<template>
	<view class="f-col r-center m-top-20">
		<view class="form-view f-col r-center">
			<u-form class="u-form-class" :model="form" ref="uForm">
				<u-form-item :border-bottom="false" class="f-row r-center c-center">
					<u-upload :show-progress="false" :custom-btn="true" :action="uploadUrl" @on-success="onUploadCover">
						<view slot="addBtn" class="f-row r-center c-center">
							<u-icon name="photo" size="30"></u-icon>
							<text>添加封面</text>
						</view>
					</u-upload>
				</u-form-item>
				<u-form-item prop="name">
					<u-input v-model="form.title" placeholder="点此输入标题(必填)" />
				</u-form-item>
				<u-form-item prop="content">
					<u-input v-model="form.content" placeholder="请输入内容" height="200" />
				</u-form-item>
				<u-form-item>
					<u-upload :show-progress="false" width="150" height="150" :action="uploadUrl"
						@on-success="onUploadIcon"></u-upload>
				</u-form-item>
			</u-form>
		</view>
		<view class="form-view3 f-col">
			<view class="form-view-item1 f-row r-center c-between" :class="!nameChecked ? 'border-none' : ''">
				<text>按名单填写</text>
				<view class="f-row r-center">
					<u-switch v-model="nameChecked" size=40></u-switch>
				</view>
			</view>
			<view class="form-view-item1 f-row r-center c-between" v-if="nameChecked">
				<text>添加人员名单</text>
				<view class="f-row r-center" @click="showPopup3 = true">
					<text>点击设置</text>
					<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
				</view>
			</view>
			<!-- <view class="form-view-item1 border-none f-row r-center c-between" @click="showPopup2=true"
				v-if="nameChecked">
				<text>名单查看权限</text>
				<view class="f-row r-center">
					<text>{{lookNameRule}}</text>
					<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
				</view>
			</view> -->
		</view>
		<view class="form-view2 f-col r-center">
			<view class="u-form-class f-row r-center c-between">
				<text>填写内容</text>
				<view class="f-row r-center" @click="showPopup4 = true">
					<text>{{ showText4 }}</text>
					<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
				</view>
			</view>
			<view class="add-view f-row r-center" v-for="(item, index) in textTypeAry5" :key="index">
				<view class="add-view-item1 f-row r-center c-center">
					<tex>{{ item.type }}</tex>
				</view>
				<input class="add-view-item2" v-model="item.titleName" />
				<u-checkbox active-color="#fc9804" v-model="item.isMust">必填</u-checkbox>
				<view class="add-view-line"></view>
				<u-icon name="more-dot-fill" size="36" @click="onAddViewEdit(index)"></u-icon>
			</view>
			<view class="add-btn f-row r-center c-center" @click="showPopup5 = true" v-if="textTypeAry5.length < 4">
				<u-icon name="plus-circle-fill" color="#3070fd" size="36"></u-icon>
				<text style="margin-left:10rpx;">添加内容</text>
			</view>
		</view>
		<view class="form-view3 f-col r-center">
			<view class="form-view-item1 f-row r-center c-between">
				<text>开始时间</text>
				<view class="f-row r-center" @click="onShowPicker(0)">
					<text>{{ beginTime }}</text>
					<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
				</view>
			</view>
			<view class="form-view-item1 f-row r-center c-between">
				<text>结束时间</text>
				<view class="f-row r-center" @click="onShowPicker(1)">
					<text>{{ endTime }}</text>
					<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
				</view>
			</view>
			<view class="form-view-item1 f-row r-center c-between">
				<text>开启循环打卡</text>
				<u-switch v-model="openSwitch1" size=40></u-switch>
			</view>
			<view style="width:100%" class="f-col r-center" v-if="openSwitch1">
				<view class="form-view-item1 f-row r-center c-between">
					<text>打卡频率</text>
					<view class="f-row r-center" @click="showPopup7 = true">
						<text>{{ showText7 }}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>可打卡时间</text>
					<view class="f-row r-center">
						<text class="time-text" @click="onShowPicker(2)">{{ beginTime2 }}</text>
						-
						<text class="time-text" @click="onShowPicker(3)">{{ endTime2 }}</text>
					</view>
				</view>
				<!-- 				<view class="form-view-item1 f-row r-center c-between">
					<text>允许补卡</text>
					<view class="f-row r-center" @click="showPopup8=true">
						<text>{{showText8}}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view> -->
				<view class="form-view-item1 f-row r-center c-between">
					<text>允许补卡</text>
					<u-switch v-model="showPopup8" size=40></u-switch>
				</view>
				<view class="form-view-item1 f-row r-center c-between" v-if="showPopup8">
					<view class="form-view-item1 f-row r-center c-between">
						<text>限制补卡次数</text>
						<view class="f-row r-center">
							<input class="form-view-input" type="number" v-model="input1" placeholder="0" />
							<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
						</view>
					</view>
				</view>

				<view class="form-view-item1 f-row r-center c-between">
					<text>参与方式</text>
					<view class="f-row r-center" @click="showPopup13 = true">
						<text>{{ showText13 }}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view>
				<!-- <view class="form-view-item1 f-row r-center c-between">
					<text>审核方式</text>
					<view class="f-row r-center" @click="showPopup14=true">
						<text>{{showText14}}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view> -->
			</view>
		</view>
		<view class="form-view3 f-col r-center" style="margin-bottom: 180rpx;">
			<view class="form-view-item1 f-row r-center c-between" @click="showMore = !showMore">
				<text>更多设置</text>
				<u-icon :name="showMore ? 'arrow-up' : 'arrow-down'" size="36"></u-icon>
			</view>
			<view class="f-col r-center" style="width:100%;" v-if="showMore">
				<!-- <view class="form-view-item1 f-row r-center c-between">
					<text>填写后允许修改</text>
					<view class="f-row r-center" @click="showPopup9=true">
						<text>{{showText9}}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>填写后允许删除</text>
					<view class="f-row r-center" @click="showPopup10=true">
						<text>{{showText10}}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view> -->
				<!-- <view class="form-view-item1 f-row r-center c-between">
					<text>每人限填次数</text>
					<view class="f-row r-center">
						<input class="form-view-input" placeholder="无限制" v-model="input2" />
						<u-icon style="margin-left:20rpx;" name="edit-pen-fill" size="36"></u-icon>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>限制填写人次</text>
					<view class="f-row r-center">
						<input class="form-view-input" placeholder="无限制" v-model="input3" />
						<u-icon style="margin-left:20rpx;" name="edit-pen-fill" size="36"></u-icon>
					</view>
				</view> -->
				<view class="form-view-item1 f-row r-center c-between">
					<text>指定参与地点</text>
					<u-switch v-model="openSwitch2" size=40></u-switch>
				</view>
				<view class="form-view-item1 f-row r-center c-between" @click="cli()" v-if="openSwitch2">
					<text>定位</text>
					<text v-if="address1">{{ address1 }}</text>
					<image v-else style="width:35rpx;height:35rpx;"
						src="http://sni1muz85.hd-bkt.clouddn.com/img/icons/address.png"></image>
				</view>
				<view class="form-view-item1 f-row r-center c-between" v-if="openSwitch2">
					<text>地点</text>
					<input class="form-view-input" style="width:600rpx" placeholder="详细地址(选填)" v-model="address2" />
				</view>
				<view class="form-view-item1 f-row r-center c-between" v-if="openSwitch2">
					<text>打卡范围</text>
					<view class="f-row r-center">
						<input class="form-view-input" placeholder="范围" type="number" v-model="addressNumber" />
						<text style="margin-left:10rpx;">米</text>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>启用排行榜</text>
					<u-switch v-model="openSwitch3" size=40></u-switch>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>是否允许评论</text>
					<u-switch v-model="openSwitch5" size=40></u-switch>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>显示发布人</text>
					<u-switch v-model="openSwitch4" size=40></u-switch>
				</view>
				<view class="form-view-item1 f-row r-center c-between" v-if="openSwitch4">
					<text>发布人</text>
					<view class="f-row r-center">
						<input class="form-view-input" v-model="input4" />
						<u-icon style="margin-left:20rpx;" name="edit-pen-fill" size="36"></u-icon>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>参与接龙按钮文字</text>
					<view class="f-row r-center" @click="showPopup11 = true">
						<text>{{ showText11 }}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view>
				<view class="form-view-item1 f-row r-center c-between">
					<text>提交表单按钮文字</text>
					<view class="f-row r-center" @click="showPopup12 = true">
						<text>{{ showText12 }}</text>
						<u-icon style="margin-left:20rpx;" name="arrow-right" size="36"></u-icon>
					</view>
				</view>
			</view>
		</view>

		<bottom-popup :showPopup="showPopup2" :showTextAry="nameRuleAry" @onClickItem="onClickPopup2"
			@onClose="showPopup2 = false"></bottom-popup>
		<u-popup v-model="showPopup3" :closeable="false" border-radius="20" mode="bottom">
			<view class="popup-view2 f-col r-center">
				<text class="popup-title">设定姓名</text>
				<textarea class="popup-input-names" v-model="setJoinName" placeholder="请输入姓名名单,一行一个姓名或用逗号分割." />
			</view>
		</u-popup>
		<bottom-popup :showPopup="showPopup4" :showTextAry="showPopupAry4" @onClickItem="onClickPopup4"
			@onClose="showPopup4 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup5" :showTextAry="showPopupAry5" @onClickItem="onClickPopup5"
			@onClose="showPopup5 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup6" :showTextAry="showPopupAry6" @onClickItem="onClickPopup6"
			@onClose="showPopup6 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup7" :showTextAry="showPopupAry7" @onClickItem="onClickPopup7"
			@onClose="showPopup7 = false"></bottom-popup>
		<!-- <bottom-popup :showPopup="showPopup8" :showTextAry="showPopupAry8" @onClickItem="onClickPopup8"
			@onClose="showPopup8=false"></bottom-popup> -->
		<bottom-popup :showPopup="showPopup9" :showTextAry="showPopupAry9" @onClickItem="onClickPopup9"
			@onClose="showPopup9 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup10" :showTextAry="showPopupAry10" @onClickItem="onClickPopup10"
			@onClose="showPopup10 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup11" :showTextAry="showPopupAry11" @onClickItem="onClickPopup11"
			@onClose="showPopup11 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup12" :showTextAry="showPopupAry12" @onClickItem="onClickPopup12"
			@onClose="showPopup12 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup13" :showTextAry="showPopupAry13" @onClickItem="onClickPopup13"
			@onClose="showPopup13 = false"></bottom-popup>
		<bottom-popup :showPopup="showPopup14" :showTextAry="showPopupAry14" @onClickItem="onClickPopup14"
			@onClose="showPopup14 = false"></bottom-popup>
		<u-picker v-model="showPicker" mode="time" :params="params" @confirm="onSelectTime()"></u-picker>
		<view class="use-template-view f-row c-between r-center">
			<view class="icon-view f-col r-center c-center" @click="onSendSolitaire(1)">
				<text>保存草稿</text>
			</view>
			<!-- <view class="icon-view f-col r-center c-center">
				<image class="image1" src="http://sni1muz85.hd-bkt.clouddn.com/img/img/icons/icon5.png"></image>
				<text>预览</text>
			</view> -->
			<view class="use-template-btn" @click="onSendSolitaire(0)">立即发布</view>
		</view>
	</view>
</template>

<script>
	import bottomPopup from '@/myPage/components/bottomPopup.vue';
	export default {
		data() {
			return {
				iconUrl: "",
				form: {
					coverUrl: "",
					title: "",
					content: "",
					addIconUrl: ""
				},
				params: {},
				uploadUrl: "",
				nameChecked: false,
				// lookNameRule: "",
				nameRuleAry: ["所有人可见", "仅管理员可见", "不可见"],
				setJoinName: "",
				showPopup2: false,
				showPopup3: false,
				showPopup4: false,
				showText4: "",
				showPopupAry4: ["填写内容互不可见", "填写内容互相可见"],
				showPopup5: false,
				textTypeAry5: [],
				showPopupAry5: ["文本", "图片", "地址"],
				showPopup6: false,
				showPopupAry6: ["上移", "下移", "删除"],
				editItemIdx: 0,
				showPicker: false,
				beginTime: "",
				endTime: "",
				selectTimeType: 0,
				openSwitch1: false,
				showPopup7: false,
				showText7: "",
				showPopupAry7: ["每天", "每月", "每周"],
				showPopup8: false,
				showText8: "",
				showPopupAry8: ["不启用", "总限可补卡次数", "每天可补卡次数"],
				beginTime2: "00:00",
				endTime2: "23:59",
				input1: "",
				showMore: false,
				// showPopup9: false,
				// showText9: "",
				// showPopupAry9: ["接龙终止前", "不可修改"],
				// showPopup10: false,
				// showText10: "",
				// showPopupAry10: ["接龙终止前", "不可删除"],
				input2: "",
				input3: "",
				input4: "",
				openSwitch2: false,
				openSwitch3: false,
				openSwitch4: false,
				openSwitch5: false,
				showPopup11: false,
				showText11: "",
				showPopupAry11: ["立即打卡", "我要打卡"],
				showPopup12: false,
				showText12: "",
				showPopupAry12: ["提交", "保存", "确认", "同意"],
				showPopup13: false,
				showText13: "",
				showPopupAry13: ["允许任何人加入", "审核后加入"],
				showPopup14: false,
				// showText14: "",
				// showPopupAry14: ["任何人都需要审核", "管理员/助教邀请的人无需审核"],
				address1: "",
				address2: "",
				addressNumber: "500",
			};
		},
		components: {
			bottomPopup
		},
		onLoad(item) {
			this.uploadUrl = this.$api.uploadPic;
			this.lookNameRule = this.nameRuleAry[0];
			this.showText4 = this.showPopupAry4[0];
			this.textTypeAry5 = [{
				type: this.showPopupAry5[0],
				isMust: true,
				titleName: this.showPopupAry5[0]
			}];
			let cObj = this.getCreateTime();
			this.beginTime = `${cObj.y}-${cObj.m}-${cObj.d} ${cObj.h}:${cObj.mm}`;
			let cObj2 = this.getCreateTime(new Date().getTime() + 30 * 24 * 60 * 60 * 1000);
			this.endTime = `${cObj2.y}-${cObj2.m}-${cObj2.d} ${cObj2.h}:${cObj2.mm}`;
			this.showText7 = this.showPopupAry7[0];
			this.showText8 = this.showPopupAry8[0];
			this.showText9 = this.showPopupAry9[0];
			this.showText10 = this.showPopupAry10[0];
			this.showText11 = this.showPopupAry11[0];
			this.showText12 = this.showPopupAry12[0];
			this.showText13 = this.showPopupAry13[0];
			this.showText14 = this.showPopupAry14[0];
		},
		methods: {
			onClickPopup2(idx) {
				this.showPopup2 = false;
				this.lookNameRule = this.nameRuleAry[idx];
			},
			onClickPopup4(idx) {
				this.showPopup4 = false;
				this.showText4 = this.showPopupAry4[idx];
			},
			onClickPopup5(idx) {
				this.showPopup5 = false;
				this.textTypeAry5.push({
					type: this.showPopupAry5[idx],
					isMust: true,
					titleName: this.showPopupAry5[idx]
				})
			},
			onClickPopup6(idx) {
				this.showPopup6 = false;
				if (this.editItemIdx == 0) {
					return;
				}
				if (idx == 0) {
					if (this.editItemIdx == 1) {
						return;
					}
					// 上移
					let temp = this.textTypeAry5[this.editItemIdx - 1];
					this.textTypeAry5[this.editItemIdx - 1] = this.textTypeAry5[this.editItemIdx];
					this.textTypeAry5[this.editItemIdx] = temp;
				} else if (idx == 1) {
					// 下移
					if (this.editItemIdx >= this.textTypeAry5.length - 1) {
						return;
					}
					let temp = this.textTypeAry5[this.editItemIdx + 1];
					this.textTypeAry5[this.editItemIdx + 1] = this.textTypeAry5[this.editItemIdx];
					this.textTypeAry5[this.editItemIdx] = temp;
				} else if (idx == 2) {
					if (this.textTypeAry5[this.editItemIdx]) {
						this.textTypeAry5.splice(this.editItemIdx, 1);
					}
				}
			},
			onClickPopup7(idx) {
				this.showPopup7 = false;
				this.showText7 = this.showPopupAry7[idx];
			},
			onClickPopup8(idx) {
				this.showPopup8 = false;
				this.showText8 = this.showPopupAry8[idx];
			},
			onClickPopup9(idx) {
				this.showPopup9 = false;
				this.showText9 = this.showPopupAry9[idx];
			},
			onClickPopup10(idx) {
				this.showPopup10 = false;
				this.showText10 = this.showPopupAry10[idx];
			},
			onClickPopup11(idx) {
				this.showPopup11 = false;
				this.showText11 = this.showPopupAry11[idx];
			},
			onClickPopup12(idx) {
				this.showPopup12 = false;
				this.showText12 = this.showPopupAry12[idx];
			},
			onClickPopup13(idx) {
				this.showPopup13 = false;
				this.showText13 = this.showPopupAry13[idx];
			},
			onClickPopup14(idx) {
				this.showPopup14 = false;
				this.showText14 = this.showPopupAry14[idx];
			},
			onAddViewEdit(idx) {
				this.editItemIdx = idx;
				this.showPopup6 = true;
			},
			onShowPicker(idx) {
				this.selectTimeType = idx;
				this.showPicker = true;
				if (idx < 2) {
					this.params = {
						year: true,
						month: true,
						day: true
						// hour: true,
						// minute: true
					}
				} else {
					this.params = {
						hour: true,
						minute: true
					}
				}
			},
			onSelectTime(obj) {
				let timeStr = `${obj.year}-${obj.month}-${obj.day}`;
				// let timeStr = `${obj.year}-${obj.month}-${obj.day} ${obj.hour}:${obj.minute}`;
				if (this.selectTimeType == 0) {
					this.beginTime = timeStr;
				} else if (this.selectTimeType == 1) {
					this.endTime = timeStr;
				} else if (this.selectTimeType == 2) {
					this.beginTime2 = `${obj.hour}:${obj.minute}`;
				} else if (this.selectTimeType == 3) {
					this.endTime2 = `${obj.hour}:${obj.minute}`;
				}
			},
			getCreateTime(sec = null) {
				var current = sec ? new Date(sec) : new Date(); //实例化Date对象
				var y = current.getFullYear(); //获取年份
				var m = current.getMonth() + 1; //获取月份，默认显示0-11，所以+1
				m = m < 10 ? ('0' + m) : m;
				var d = current.getDate(); //获取日期
				// var h = current.getHours(); //获取时
				// var mm = current.getMinutes(); //获取分
				// var s = current.getSeconds(); //获取秒
				d = d < 10 ? ('0' + d) : d;
				h = h < 10 ? ('0' + h) : h;
				mm = mm < 10 ? ('0' + mm) : mm;
				s = s < 10 ? ('0' + s) : s;
				return {
					y: y,
					m: m,
					d: d
					// h: h,
					// mm: mm
				};
			},
			onUploadCover(data, index, lists, name) {
				console.log(123124324234234)
				if (!data.url) {
					return;
				}
				this.form.coverUrl = data.url;
			},
			onUploadIcon(data, index, lists, name) {
				if (!data.url) {
					return;
				}
				this.form.addIconUrl = data.url;
			},
			cli() {
				let that = this;
				uni.chooseLocation({
					success: function(res) {
						that.address1 = res.name;
					}
				});
			},
			onSendSolitaire(isDraft) {
				let that = this;
				let tempJoinList = []
				for (let v of this.textTypeAry5) {
					tempJoinList.push({
						isMust: v.isMust ? 1 : 0,
						titleName: v.titleName,
						type: v.type
					});
				}
				this.$api.request({
					url: this.$api.solitaire,
					method: "POST",
					data: {
						checkImg: this.form.coverUrl,
						checkTitle: this.form.title,
						checkContent: this.form.content,
						addImg: this.form.addIconUrl,
						isSee: this.showPopupAry4.indexOf(this.showText4),
						startTime: this.beginTime,
						endTime: this.endTime,
						checkInFrequency: this.showPopupAry7.indexOf(this.showText7),
						checkTimePart: `${this.beginTime2}-${this.endTime2}`,
						isDeleted: 0,
						isShowName: this.openSwitch4 ? 1 : 0,
						isStaff: this.nameChecked ? 1 : 0,
						staffName: this.setJoinName.replace(/\n/g, ","),
						userId: this.$store.state.userId,
						isAddress: this.openSwitch2 ? 1 : 0,
						address: this.address1 + this.address2,
						addressRange: this.addressNumber,
						// isCheckNumLimit: 0,
						// dayNum: 1,
						isReplacement: this.showText8 != this.showPopupAry8 ? 1 : 0,
						replacementNum: this.input1 ? Math.input1 : 0,
						joinList: tempJoinList,
						involvedMethod: this.showPopupAry13.indexOf(this.showText13),
						// process: this.showPopupAry14.indexOf(this.showText14),
						// staffPermission: this.nameRuleAry.indexOf(this.lookNameRule),
						// isComment: this.openSwitch5 ? 1 : 0,
						isRanking: this.openSwitch3 ? 1 : 0,
						isPublisher: this.openSwitch4 ? 1 : 0,
						partakeButton: this.showText11,
						submitButton: this.showText12
						// commissionId: this.commissionId
						// isDraft: isDraft
					}
				}).then(resp => {
					if (resp.code == 200) {
						uni.navigateTo({
							url: "/myPage/sign/signOn"
						})
					}
				});
			}
		},
	}
</script>

<style lang="scss" scoped>
	@import "@/static/css/app.scss";

	.form-view {
		width: 750rpx;
		background: #fff;

		.u-form-class {
			width: 710rpx;
		}
	}

	.add-icon {
		width: 50rpx;
		height: 50rpx;
		border-radius: 10rpx;
		border: 1px solid #efefef;
		margin-right: 20rpx;
	}

	.form-view2 {
		width: 720rpx;
		background: #fff;
		border-radius: 10rpx;
		padding: 25rpx;
		margin-top: 20rpx;
		font-size: 28rpx;

		.u-form-class {
			width: 670rpx;
		}

		.add-view {
			width: 670rpx;
			height: 70rpx;
			border: 1px solid rgb(237, 236, 240);
			border-radius: 10rpx;
			margin-top: 20rpx;

			.add-view-item1 {
				width: 35rpx;
				height: 100%;
				background: rgb(237, 236, 240);
				font-size: 18rpx;
				color: rbg(142, 142, 144);
				text-align: center;
			}

			.add-view-item2 {
				margin-left: 20rpx;
				width: 300rpx;
				margin-right: 80rpx;
			}

			.add-view-line {
				width: 1rpx;
				height: 40rpx;
				background: rgb(205, 205, 205);
				margin-right: 30rpx;
			}
		}

		.add-btn {
			margin-top: 20rpx;
			width: 230rpx;
			height: 60rpx;
			border-radius: 60rpx;
			background: rgb(234, 240, 254);
			color: #3070fd;
		}
	}

	.form-view3 {
		width: 720rpx;
		background: #fff;
		border-radius: 10rpx;
		padding: 0 25rpx;
		margin-top: 20rpx;
		font-size: 28rpx;
	}

	.form-view-item1 {
		position: relative;
		width: 100%;
		height: 80rpx;
		border-bottom: 1px solid rgb(237, 236, 240);
	}

	.form-view-input {
		text-align: right;
		width: 100rpx;
	}

	.border-none {
		border: none;
	}

	.m-top-20 {
		margin-top: 20rpx;
	}

	.close-content {
		position: absolute;
		top: 10rpx;
		right: 0;
	}

	.use-template-view {
		position: fixed;
		bottom: 0;
		margin-top: 200rpx;
		background: #fff;
		box-shadow: 0px 0px 5px 2px rgba(100, 100, 100, 0.5);
		width: 750rpx;
		padding: 0 20rpx;
		height: 100rpx;
		z-index: 999;

		.use-template-btn {
			width: 480rpx;
			height: 70rpx;
			line-height: 70rpx;
			border-radius: 35rpx;
			text-align: center;
			background: #fc9802;
			color: #fff;
		}

		.icon-view {
			position: relative;
			font-size: 18rpx;

			.image1 {
				width: 38rpx;
				height: 38rpx;
				margin-bottom: 5rpx;
			}
		}
	}

	.time-text {
		width: 150rpx;
		height: 50rpx;
		line-height: 50rpx;
		font-size: 26rpx;
		text-align: center;
		border: 1px solid #efefef;
		color: #666666;
		border-radius: 5rpx;
		margin: 0 5rpx;
	}
</style>